var ChapterConfig = require("ChapterConfig");

cc.Class({
    extends: cc.Component,

    properties: {
        canvas:{
			default:null,
			type:cc.Node
		},
		chapterSelectBtn:{
			default:null,
			type:cc.Prefab
		},
		btnLeft:{
			default:null,
			type:cc.Node
		},
		btnRight:{
			default:null,
			type:cc.Node
		},
    },

    onLoad () {
		
		this.chapterConfig = new ChapterConfig();
		
		this.chapterNmb = this.chapterConfig.chapterConfig.length;
		
		this.index = 1;
		
		this.lastIndex = this.chapterNmb%10==0?this.chapterNmb/10:Math.floor(this.chapterNmb/10)+1;
		
		console.log(this.chapterNmb+" "+this.lastIndex);
		
		this.chapterSelectBtnArr = [];
		
		this.exChangeCallback = cc.callFunc(function () {
				cc.director.loadScene('gameByChapter');
		}, this);
		
		this.showLeftOrRightCallback = cc.callFunc(function () {
				this.showLeftOrRight();
		}, this);
		
		this.showUI();
		
		var startx , starty ,pre = 0;
		
		for(var i=0;i<this.chapterNmb;i++){
		
			var chapterSelectBtn = cc.instantiate(this.chapterSelectBtn);
			
			this.chapterSelectBtnArr.push(chapterSelectBtn);
			
			if(i==0){
				startx = chapterSelectBtn.x;
				starty = chapterSelectBtn.y;
			}else if(i%10==0){
				pre = i/10*375
				startx = chapterSelectBtn.x+pre;
				starty = chapterSelectBtn.y;
			}else{
				if(i%2==1){
					startx = chapterSelectBtn.x+160+pre;
				}else{
					startx = chapterSelectBtn.x+pre;
					starty-=90;
				}
			}
			
			chapterSelectBtn.setPosition(startx,starty);
			this.node.addChild(chapterSelectBtn);
			
			
			if(i==0||cc.sys.localStorage.getItem("chapter"+(i-1))){
			
				chapterSelectBtn.getComponent(cc.Label).string = "第"+(i+1)+"关";
				
				if(cc.sys.localStorage.getItem("chapter"+i))
					chapterSelectBtn.children[0].getComponent(cc.Label).string = "最高分:"+cc.sys.localStorage.getItem("chapter"+i);
				else
					chapterSelectBtn.children[0].getComponent(cc.Label).string = "最高分:0";
				
		
				this.bindClickEvent(chapterSelectBtn.getComponent(cc.Button), i);
			}else{
				
				chapterSelectBtn.getComponent(cc.Label).string = "???";
				
			}
			
		}
		
		this.bindClickLeftOrRightEvent(this.btnLeft.getComponent(cc.Button), 'left');
		this.bindClickLeftOrRightEvent(this.btnRight.getComponent(cc.Button), 'right');
		
		this.showLeftOrRight();
		
	},
	
	bindClickEvent: function (button, index) {
		 
       var clickEventHandler = new cc.Component.EventHandler();
       //这个 node 节点是你的事件处理代码组件所属的节点
       clickEventHandler.target = this.node; 
       //这个是代码文件名
       clickEventHandler.component = "ChapterSelect";
       clickEventHandler.handler = "callback";
       clickEventHandler.customEventData = index;
       button.clickEvents.push(clickEventHandler);
   },
   
   bindClickLeftOrRightEvent: function (button, leftOrRight) {
		 
       var clickEventHandler = new cc.Component.EventHandler();
       //这个 node 节点是你的事件处理代码组件所属的节点
       clickEventHandler.target = this.node; 
       //这个是代码文件名
       clickEventHandler.component = "ChapterSelect";
       clickEventHandler.handler = "callback2";
       clickEventHandler.customEventData = leftOrRight;
       button.clickEvents.push(clickEventHandler);
   },

   //点击事件回调 target ==》node， customEventData ==》 index
   callback: function (target, customEventData) {
	   
	   window.level = customEventData;
	   
	   this.canvas.runAction(cc.fadeOut(1));
		
	   this.node.runAction(cc.sequence(cc.delayTime(0.8),this.exChangeCallback));
	   
   },
   
   callback2: function (target, customEventData) {
	   
		if(customEventData=="left"){
			if(this.index<=1)
				return;
			else
				this.index--;
			for(var i=0;i<this.chapterSelectBtnArr.length;i++){
				this.chapterSelectBtnArr[i].runAction(cc.moveBy(0.1,375,0));
			}
		}else{
			if(this.index>=this.lastIndex)
				return;
			else
				this.index++;
			for(var i=0;i<this.chapterSelectBtnArr.length;i++){
				this.chapterSelectBtnArr[i].runAction(cc.moveBy(0.1,-375,0));
			}
		}
		
		this.btnLeft.active = false;
	    this.btnRight.active = false;
		
		this.node.runAction(cc.sequence(cc.delayTime(0.2),this.showLeftOrRightCallback));
	   
   },
   
   showLeftOrRight(){
	   if(this.index>1)
		   this.btnLeft.active = true;
	   else
		   this.btnLeft.active = false;
	   
	   if(this.index<this.lastIndex)
			this.btnRight.active = true;
	   else
		   this.btnRight.active = false;
   },
   
   showUI(){
	   this.canvas.opacity =0;
		
	   this.canvas.runAction(cc.fadeIn(1));
   }
});
